<style>
.mb20 {
  margin-bottom: 20px;
}
.ivu-table td.demo-table-info-column{
  background-color: #FFFACD;
  color: #fff;
}
.opt-area-02 {
  display: flex;
  align-items: center;
  flex-direction: column;
  border: 1px solid #abdcff;
  background-color: #f0faff;
  padding: 8px 16px 8px 16px;
  border-radius: 4px;
  margin-bottom: 10px;
}
.opt-area-02 .right-con {
  width: 100%;
  margin-top: 5px;
  display: flex;
}

.opt-area-02 .left-con {
  font-size: 14px;
  width: 100%;
}

.opt-area-02 .left-con span {
  font-weight: bold;
}

.opt-area-02 .right-con input {
  width: 164px;
  margin-right: 10px;
}

.opt-area-02 .right-con .input-frame {
  width: 164px;
  margin-right: 10px;
}
.opt-area-02 .right-con .span-frame {
  width: 80px;
  margin-right: 10px;
}
</style>

<template>
  <div>
    <div class="opt-area-02">
      <div class="right-con">
        <div class="input-frame">
          <Input type="text"  placeholder="请输入姓名" style="width: 164px" v-model="searchInfo.name"
                 icon="ios-search"/>
        </div>
        <div class="input-frame" style="width: 164px">
          <Input type="text"  placeholder="请输入身份证号码" style="width: 164px" v-model="searchInfo.cardno"
                 icon="ios-search"/>
        </div>
        <div class="input-frame" style="width: 164px">
          <Select v-model="searchInfo.subsidy_type" placeholder="请选择补贴类型" transfer="" style="width: 164px;">
            <Option value="">全部</Option>
            <Option value="护理补贴">重度残疾人护理补贴</Option>
            <Option value="生活补贴">困难残疾人生活补贴</Option>
          </Select>
        </div>
        <div class="input-frame" style="width: 164px">
          <Select v-model="searchInfo.status" placeholder="请选择办理状态" transfer="" style="width: 164px;">
            <Option value="">全部</Option>
            <Option value="1">已办理</Option>
            <Option value="0">未办理</Option>
          </Select>
        </div>
        <div class="input-frame" style="width: 164px" v-if="companyCode==='LM'">
          <Select v-model="searchInfo.county" placeholder="请选择区域" transfer="" style="width: 164px;">
            <Option v-for="item in code" :value="item.title" :key="item.company_code">{{item.title}}</Option>
          </Select>
        </div>
        <Button type="info" size="small" @click="search(1)" style="margin-right: 5px;width:100px">搜索</Button>
        <Button type="info" size="small" @click="refresh()" style="margin-right: 5px;width:60px">刷新</Button>
        <Button type="info" size="small" @click="exportData" style="margin-right: 5px;width:100px">导出数据</Button>
        <Button type="primary" size="small" @click="clearData()">清空</Button>
      </div>
    </div>
    <div style="margin-top: 20px">
      <Table border :columns="columns1" :data="data"  ref="table" >
        <template slot-scope="{ row }" slot="registerstr">
          <strong  v-if="row.registerstr!=='沈阳户籍'" style="color: black">{{ row.registerstr }}</strong>
          <strong  v-if="row.registerstr==='沈阳户籍'" style="color: black">{{ row.registerstr }}</strong>
        </template>
        <template slot-scope="{ row }" slot="allowanceskind">
          <strong  style="color: black">{{ row.allowanceskind }}</strong>
        </template>
        <template slot-scope="{ row }" slot="disability_type">
          <strong style="color: black">{{ row.disability_type +','+row.disability_grade }}</strong>
        </template>
      </Table>
    </div>
    <div  class="page" style="margin-top: 20px;text-align: right">
      <Page :total="totalnum" :current="currentPageNo" :page-size="currentPageSize" show-total @on-change="change" class="page_style"/>
    </div>
  </div>
</template>

<script>
import { date2str, findPersonnelList, getSubordinate } from '@/api/stree'

export default {
  name: 'index.vue',
  data () {
    return {
      currentPageNo: 1,
      currentPageSize: 10,
      code: [],
      loginName: '',
      totalnum: 0,
      columns1: [
        {
          title: '序号',
          type: 'index',
          key: 'index',
          width: 80,
          align: 'center'
        },
        {
          title: '区(县)',
          key: 'county',
          width: 100,
          align: 'center'
        },
        {
          title: '街道',
          key: 'township',
          width: 180,
          align: 'center'
        },
        {
          title: '姓名',
          key: 'name',
          width: 120,
          align: 'center'
        },
        {
          title: '身份证号',
          width: 200,
          key: 'cardno',
          align: 'center'
        },
        {
          title: '生活补贴办理状态',
          width: 150,
          key: 'sh_status',
          align: 'center',
          render: (h, params) => {
            return h('span', params.row.sh_status === '2' || params.row.sh_status === 2 ? '在册' : params.row.sh_status === '1' || params.row.sh_status === 1 ? '已办理' : '未办理')
          }
        },
        {
          title: '护理补贴办理状态',
          width: 150,
          key: 'hl_status',
          align: 'center',
          render: (h, params) => {
            return h('span', params.row.hl_status === '2' || params.row.hl_status === 2 ? '在册' : params.row.hl_status === '1' || params.row.hl_status === 1 ? '已办理' : '未办理')
          }
        },
        {
          title: '残疾类别',
          width: 200,
          key: 'disability_type',
          align: 'center'
        },
        {
          title: '残疾等级',
          width: 150,
          key: 'disability_grade',
          align: 'center'
        },
        {
          title: '残疾人证号',
          width: 150,
          key: 'disability_certificate_number',
          align: 'center'
        },
        {
          title: '性别',
          width: 150,
          key: 'sex',
          align: 'center'
        },
        {
          title: '户籍性质',
          width: 150,
          key: 'household',
          align: 'center',
          render: (h, params) => {
            return h('span', params.row.household === '1' || params.row.household === 1 ? '农业' : '非农业')
          }
        },
        {
          title: '家庭住址',
          width: 280,
          key: 'homeaddress',
          align: 'center'
        },
        {
          title: '残疾人电话',
          width: 150,
          key: 'disablility_phone',
          align: 'center'
        },
        {
          title: '联系人电话',
          width: 150,
          key: 'link_phone',
          align: 'center'
        },
        {
          title: '户籍情况',
          width: 300,
          key: 'registerstr',
          slot: 'registerstr',
          align: 'center',
          className: 'demo-table-info-column'
        },
        {
          title: '低保情况',
          width: 150,
          key: 'allowanceskind',
          slot: 'allowanceskind',
          align: 'center',
          className: 'demo-table-info-column'
        },
        {
          title: '残疾情况',
          width: 150,
          fixed: 'right',
          key: 'disability',
          slot: 'disability_type',
          align: 'center',
          className: 'demo-table-info-column'
        }
      ],
      searchInfo: {
        name: '',
        cardno: '',
        subsidy_type: '',
        status: '',
        county: ''
      },
      data: [],
      data7: []
    }
  },
  methods: {
    init (pageno) {
      let param = {}

      if (this.loginName === 'LM07' || this.loginName === 'LM2249415') {
        param = {
          pageSize: this.currentPageSize,
          pageNo: this.currentPageNo,
          name: this.searchInfo.name,
          cardno: this.searchInfo.cardno,
          type: 0,
          citystr: this.searchInfo.county,
          subsidy_type: this.searchInfo.subsidy_type,
          status: this.searchInfo.status
        }
      } else {
        param = {
          pageSize: this.currentPageSize,
          pageNo: this.currentPageNo,
          name: this.searchInfo.name,
          cardno: this.searchInfo.cardno,
          citystr: this.searchInfo.county,
          subsidy_type: this.searchInfo.subsidy_type,
          status: this.searchInfo.status
        }
      }

      findPersonnelList(param).then(ret => {
        console.log(ret)
        if (ret.data.errcode === 0) {
          this.data = ret.data.data.results
          this.totalnum = ret.data.data.totalRecord
        } else {
          this.$Modal.error({
            title: '错误',
            content: ret.data.errmsg
          })
        }
      })
    },
    change (pageNo) {
      console.log(pageNo)
      this.currentPageNo = pageNo
      this.currentPageSize = 10
      this.init(this.currentPageNo)
    },
    search (pageNo) {
      this.currentPageNo = 1
      this.init()
    },
    refresh () {
      this.currentPageNo = 1
      this.currentPageSize = 10
      this.searchInfo = {
        name: '',
        cardno: '',
        subsidy_type: '',
        status: '',
        county: ''
      }
      this.init()
    },
    clearData () {
      this.searchInfo = {
        name: '',
        cardno: '',
        subsidy_type: '',
        status: '',
        county: ''
      }
    },
    areaCode () {
      let param = {
        'pid': '0'
      }
      getSubordinate(param).then(ret => {
        this.code = ret.data.data.list
        console.log(ret.data.data, 'sssss', this.code)
      })
    },
    exportData () {
      let param = {}

      if (this.loginName === 'LM07' || this.loginName === 'LM2249415') {
        param = {
          pageSize: 200000,
          pageNo: 1,
          name: this.searchInfo.name,
          cardno: this.searchInfo.cardno,
          type: 0,
          citystr: this.searchInfo.county,
          subsidy_type: this.searchInfo.subsidy_type,
          status: this.searchInfo.status
        }
      } else {
        param = {
          pageSize: 200000,
          pageNo: 1,
          name: this.searchInfo.name,
          cardno: this.searchInfo.cardno,
          citystr: this.searchInfo.county,
          subsidy_type: this.searchInfo.subsidy_type,
          status: this.searchInfo.status
        }
      }

      findPersonnelList(param).then(ret => {
        if (ret.data.errcode === 0) {
          this.data7 = ret.data.data.results
          let today = new Date()
          this.$refs.table.exportCsv({
            filename: '政策找人数据' + date2str(today),
            columns: this.columns1,
            data: this.data7.map((item, index) => {
              item.index = index + 1
              if (item.disability_type === '非残疾人') {
                item.disability = '非残疾人'
              } else {
                item.disability = item.disability_type + '`' + item.disability_grade
              }
              if (item.household === '1' || item.household === 1) {
                item.household = '农业'
              } else {
                item.household = '非农业'
              }
              if (item.sh_status === '2' || item.sh_status === 2) {
                item.sh_status = '在册'
              } else if (item.sh_status === '1' || item.sh_status === 1) {
                item.sh_status = '已办理'
              } else {
                item.sh_status = '未办理'
              }
              if (item.hl_status === '2' || item.hl_status === 2) {
                item.hl_status = '在册'
              } else if (item.hl_status === '1' || item.hl_status === 1) {
                item.hl_status = '已办理'
              } else {
                item.hl_status = '未办理'
              }
              return item
            }),
            original: false
          })
        } else {
          this.$Modal.error({
            title: '错误',
            content: ret.data.errmsg
          })
        }
      })
    }
  },
  computed: {
    companyCode () {
      return this.$store.state.user.severUserInfo.company_code
    }
  },
  mounted () {
    this.init()
    this.areaCode()
    this.loginName = this.$store.state.user.severUserInfo.loginName
  }
}
</script>
